<div>
    <ul class="security-list2">
        <li *ngFor="let item of dataList">
            <div class="security-head">
                <div class="security-head-left">
                    <label nz-checkbox [(ngModel)]="item.checked" (ngModelChange)="checkedAll(item)"></label>
                    <div class="security-text">
                        {{item.permissionName}}
                    </div>
                    <p>共 {{item.totalNum}} 款软件, {{item.preventedNum}} 款阻止, {{item.allowedNum}} 款允许, {{item.unSetNum}} 款未设置</p>
                </div>
                <div class="security-head-right">
                    <nz-select style="width: 120px" [(ngModel)]="item.cz" nzAllowClear nzPlaceHolder="修改权限">
                        <nz-option nzValue="Enabled" nzLabel="开启"></nz-option>
                        <nz-option nzValue="Disabled" nzLabel="关闭"></nz-option>
                    </nz-select>
                </div>
            </div>
            <div class="security-body">
                <div class="equipment-list">
                    <div *ngFor="let child of item.list">
                        <div class="equipment-logo">
                            <img src="../../assets/img/logo-small.png" />
                            <label nz-checkbox [(ngModel)]="child.checked"></label>
                        </div>
                        <h3>{{child.deviceName}}</h3>
                        <p>
                            <span *ngIf="child.status === 'Allowed'" style="color: #14CE79;">(已允许)</span>
                            <span *ngIf="child.status === 'Prevented'" style="color: #FF5555;">(已阻止)</span>
                            <span *ngIf="child.status === 'UnSet'" style="color: #999999;">(未设置)</span>
                        </p>
                    </div>
                </div>
            </div>
        </li>
    </ul>
</div>